<template>
  <div class="logisticsWaybill">
    <stitle :bg="bg" text="物流运单数据统计" :type="0" />
    <div class="tablecon">
      <el-table :data="tableData" style="width: 100%" height="145px">
        <el-table-column prop="id" label="物流单号" width="80px">
          <template slot-scope="scope">
            <te-marquee
              :val="scope.row.id"
              align="center"
              speed="slow"
              :height="25"
            />
          </template>
        </el-table-column>
        <el-table-column prop="name" label="产品" width="60px">
          <template slot-scope="scope">
            <te-marquee
              :val="scope.row.name"
              align="center"
              speed="slow"
              :height="25"
            />
          </template>
        </el-table-column>
        <el-table-column prop="num" label="数量" width="70px">
        </el-table-column>
        <el-table-column prop="time" label="发货时间" width="90px">
        </el-table-column>
        <el-table-column label="操作" width="50px">
          <template slot-scope="scope">
            <i
              style="color: #0082ff"
              class="el-icon-s-order"
              @click="handleClick(scope.row)"
            ></i>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import stitle from "@/components/common/stitle";
export default {
  name: "logisticsWaybill",
  components: {
    stitle,
  },
  data() {
    return {
      bg: require("@/assets/images/DispatchCommand/stitle.png"),
      tableData: [
        {
          id: "SF202201",
          name: "超力福",
          num: "2000",
          time: "2022/03/31",
        },
        {
          id: "SF202201",
          name: "超力福",
          num: "2000",
          time: "2022/03/31",
        },
        {
          id: "SF202201",
          name: "超力福",
          num: "2000",
          time: "2022/03/31",
        },
        {
          id: "SF202201",
          name: "超力福",
          num: "2000",
          time: "2022/03/31",
        },
        {
          id: "SF202201",
          name: "超力福",
          num: "2000",
          time: "2022/03/31",
        },
        {
          id: "SF202201",
          name: "超力福",
          num: "2000",
          time: "2022/03/31",
        },
      ],
    };
  },
  methods: {
    handleClick() {},
  },
  mounted() {},
  computed: {},
};
</script>

<style lang="scss"  scoped>
.logisticsWaybill {
  width: 100%;
  padding-right: 70px;
  box-sizing: border-box;
  margin-top: 20px;
}
</style>